<template>
  <div>
    <ZgDialog
      v-model="visible"
      title="新增表单"
      top="10%"
      width="40%"
      @ok="save">
      <a-form :labelCol="{ span: 6 }" :wrapperCol="{ span: 18 }">
        <a-form-item label="表单名称" required>
          <ZgInput v-model="obj.name"></ZgInput>
        </a-form-item>
        <a-form-item label="表单编码" required>
          <ZgInput v-model="obj.code"></ZgInput>
        </a-form-item>
        <a-form-item label="附件管理" required>
          <ZgSwitch :width="80" v-model="obj.hasAttach" :text="['开启','关闭']"></ZgSwitch>
        </a-form-item>
        <a-form-item label="验证接口地址">
          <ZgInput v-model="obj.validUrl"></ZgInput>
        </a-form-item>
        <a-form-item label="主表信息">
          <ZgSelect v-model="obj.parId" :options="selectOption"></ZgSelect>
        </a-form-item>
        <a-form-item label="数据来源" required>
          <ZgSwitch :width="80" v-model="obj.isDataSource" :text="['开启','关闭']"></ZgSwitch>
        </a-form-item>
      </a-form>
    </ZgDialog>
  </div>
</template>
<script>
export default {
  data () {
    return {
      visible: false,
      selectOption: [],
      obj: {
        name: '',
        code: '',
        hasAttach: false,
        validUrl: '',
        parId: '',
        isDateSource: false
      }
    }
  },
  methods: {
    open () {
      this.visible = true
      this.$http.post('zg-autoform/form/list', { name: '' }, res => {
        this.selectOption = res.map(item => ({
          label: item.name,
          value: item.id
        }))
        console.log(this.selectOption, 'oioi')
      })
    },
    save () {
      if (this.obj.name.length === 0) {
        this.$warning({ title: '请输入表单名称' })
        return
      }
      if (this.obj.code.length === 0) {
        this.$warning({ title: '请输入表单编码' })
        return
      }
      this.$http.post('/zg-autoform/form/add', this.obj, () => {
        this.visible = false
        this.$emit('ok')
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
